.article-editor {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;

  .editor-header {
    margin-bottom: 20px;
    
    .ant-input {
      border: none;
      padding: 0;
      box-shadow: none;
      
      &:focus {
        border: none;
        box-shadow: none;
      }
      
      &::placeholder {
        color: #bfbfbf;
      }
    }
    
    .cover-upload {
      .cover-preview {
        .ant-image {
          border-radius: 4px;
          overflow: hidden;
          border: 1px solid #d9d9d9;
        }
      }
    }
  }

  .editor-content {
    min-height: 600px;
    
    .ant-tabs-content-holder {
      padding-top: 16px;
    }
    
    .converted-documents {
      margin-top: 24px;
      
      .ant-card {
        margin-bottom: 12px;
        
        .ant-card-head {
          min-height: auto;
          padding: 8px 16px;
          
          .ant-card-head-title {
            font-size: 14px;
            font-weight: 500;
          }
        }
        
        .ant-card-body {
          padding: 12px 16px;
        }
      }
    }
  }

  // 预览模态框样式
  .article-preview-modal {
    .ant-modal-body {
      padding: 0;
    }
    
    .article-preview {
      .preview-cover {
        width: 100%;
        height: 300px;
        overflow: hidden;
        border-radius: 8px 8px 0 0;
        
        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }
      
      .preview-title {
        padding: 24px 24px 16px;
        border-bottom: 1px solid #f0f0f0;
        
        h1 {
          margin: 0;
          font-size: 28px;
          font-weight: 600;
          line-height: 1.4;
          color: #262626;
        }
      }
      
      .preview-content {
        padding: 24px;
        line-height: 1.8;
        font-size: 16px;
        color: #262626;
        
        // 继承富文本编辑器的样式
        h1, h2, h3, h4, h5, h6 {
          margin: 24px 0 16px 0;
          font-weight: 600;
          line-height: 1.4;
        }

        h1 { font-size: 2em; }
        h2 { font-size: 1.5em; }
        h3 { font-size: 1.25em; }
        h4 { font-size: 1.1em; }
        h5 { font-size: 1em; }
        h6 { font-size: 0.9em; }

        p {
          margin: 16px 0;
          line-height: 1.8;
        }

        img {
          max-width: 100%;
          height: auto;
          border-radius: 8px;
          margin: 16px 0;
          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }

        .video-wrapper {
          margin: 24px 0;
          border-radius: 8px;
          overflow: hidden;
          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
          
          iframe, video {
            width: 100%;
            height: 400px;
            border: none;
          }
        }

        ul, ol {
          margin: 16px 0;
          padding-left: 24px;
          
          li {
            margin: 8px 0;
            line-height: 1.8;
          }
        }

        blockquote {
          border-left: 4px solid #1890ff;
          margin: 24px 0;
          padding: 16px 24px;
          background: #f6f8fa;
          color: #666;
          font-style: italic;
          border-radius: 0 4px 4px 0;
        }

        code {
          background: #f1f3f4;
          padding: 2px 6px;
          border-radius: 4px;
          font-family: 'Monaco', 'Consolas', monospace;
          font-size: 0.9em;
        }

        pre {
          background: #f6f8fa;
          border-radius: 8px;
          padding: 20px;
          margin: 24px 0;
          overflow-x: auto;
          
          code {
            background: none;
            padding: 0;
          }
        }

        hr {
          border: none;
          border-top: 2px solid #e8e8e8;
          margin: 32px 0;
        }

        table {
          border-collapse: collapse;
          width: 100%;
          margin: 24px 0;
          
          th, td {
            border: 1px solid #d9d9d9;
            padding: 12px 16px;
            text-align: left;
          }
          
          th {
            background: #fafafa;
            font-weight: 600;
          }
        }

        a {
          color: #1890ff;
          text-decoration: none;
          
          &:hover {
            text-decoration: underline;
          }
        }

        // 文档转换内容样式
        .pdf-placeholder,
        .ppt-placeholder {
          border: 2px dashed #d9d9d9;
          padding: 40px;
          text-align: center;
          border-radius: 8px;
          background: #fafafa;
          margin: 24px 0;
          
          h3 {
            color: #1890ff;
            margin-bottom: 16px;
          }
          
          p {
            color: #666;
            margin: 8px 0;
          }
        }
      }
    }
  }

  // 响应式设计
  @media (max-width: 768px) {
    padding: 12px;
    
    .editor-header {
      margin-bottom: 16px;
      
      .ant-input {
        font-size: 20px;
      }
    }
    
    .article-preview-modal {
      .article-preview {
        .preview-cover {
          height: 200px;
        }
        
        .preview-title {
          padding: 16px 16px 12px;
          
          h1 {
            font-size: 24px;
          }
        }
        
        .preview-content {
          padding: 16px;
          font-size: 15px;
          
          .video-wrapper {
            iframe, video {
              height: 250px;
            }
          }
        }
      }
    }
  }
}